import React from 'react';
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import { Provider } from 'react-redux';
import { store } from './store';
import MainLayout from './components/layout/MainLayout';
import Dashboard from './pages/Dashboard/Dashboard';
import RuleConfig from './pages/RuleConfig/RuleConfig';
import RuleConfigEdit from './pages/RuleConfig/RuleConfigEdit';
import ResultQuery from './pages/ResultQuery/ResultQuery';
import LogQuery from './pages/LogQuery/LogQuery';
import './styles/global.css';

const App: React.FC = () => {
  return (
    <Provider store={store}>
      <ConfigProvider
        theme={{
          token: {
            colorPrimary: '#1890ff',
            borderRadius: 6,
          },
        }}
      >
        <Router>
          <Routes>
            <Route path="/" element={<MainLayout />}>
              <Route index element={<Navigate to="/dashboard" replace />} />
              <Route path="dashboard" element={<Dashboard />} />
              <Route path="rule-config" element={<RuleConfig />} />
              <Route path="rule-config/edit/:id?" element={<RuleConfigEdit />} />
              <Route path="result-query" element={<ResultQuery />} />
              <Route path="log-query" element={<LogQuery />} />
            </Route>
          </Routes>
        </Router>
      </ConfigProvider>
    </Provider>
  );
};

export default App;
